import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Row, Col, Table } from 'antd'
import '../style.scss'

class ExchangeDetail extends Component {
	render() {
		const columns = [
			{
				title: '文件名称',
				key: 'index',
				dataIndex: 'index',
			},
			{
				title: '文件目录',
				key: 'number',
				dataIndex: 'number',
			},
		]
		const dataSource = [
			{
				index: '1',
				number: '123',
			},
			{
				index: '1',
				number: '123',
			},
			{
				index: '1',
				number: '123',
			},
		]
		return (
			<div className="view">
				<p style={{ fontSize: 15, fontWeight: 'bold' }}>基本信息</p>
				<Row>
					<Col span={12}>
						<p><span className="left">资源名称</span><span style={{ marginLeft: 20 }}>2017市民户口信息</span></p>
						<p><span className="left">前置节点</span><span style={{ marginLeft: 20 }}>共享</span></p>
						<p><span className="left">更新频率</span><span style={{ marginLeft: 20 }}>共享平台方式</span></p>
						<p><span className="left">资源格式</span><span style={{ marginLeft: 20 }}>数据库</span></p>
						<p><span className="left">申请时间</span><span style={{ marginLeft: 20 }}>是</span></p>
					</Col>
					<Col span={12}>
						<p><span className="left">申请部门</span><span style={{ marginLeft: 20 }}>户口信息</span></p>
						<p><span className="left">提供部门</span><span style={{ marginLeft: 20 }}></span></p>
						<p><span className="left">开始时间</span><span style={{ marginLeft: 20 }}>接口</span></p>
						<p><span className="left">结束时间</span><span style={{ marginLeft: 20 }}></span></p>
						<p><span className="left">备注</span><span style={{ marginLeft: 20 }}></span></p>
					</Col>
				</Row>
				<Row style={{marginTop:12}}>
					<Col span={11}>
						<p style={{ fontSize: 15, fontWeight: 'bold', height: 30 }}>
							源
						</p>
						<Table columns={columns} dataSource={dataSource} bordered size='middle'/>
					</Col>
          <Col span={2}></Col>
          <Col span={11}>
						<p style={{ fontSize: 15, fontWeight: 'bold', height: 30 }}>
							目标
						</p>
						<Table columns={columns} dataSource={dataSource} bordered size='middle'/>
					</Col>
				</Row>
			</div>
		)
	}
}

const mapStateToProps = (state) => ({})

const mapDispatchToProps = (dispatch) => ({})

export default connect(mapStateToProps, mapDispatchToProps)(ExchangeDetail)
